<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <div id="num"></div>

    <script>
        let num = document.getElementById("num");

        count = 0;
        /* 
        
        UI线程与JS线程是互斥的，因为JS运行结果会影响到UI线程的结果，当JS线程运行的时候，UI线程处于冻结状态。
        
        */
        /* for (let i = 0; i < 1000000; i++) {
            num.innerText = count;
            count++;
        } */

        /* 让每一个结果都渲染一次 */
        for (let i = 0; i < 100000; i++) {
            setTimeout(() => {
                num.innerText = count;
                count++;
            })
        }
    </script>
</body>

</html>